<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>登录</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/common.css" />
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
				font-family: simhei;
			}
			#login {
			    width: 100%;
			    left: 0;
			    top: 4%;
			    padding: 10px;
			    color: #666;
			    border: 0px solid #666;
			    background-color: rgba(255,255,255,.2);
			    box-shadow: 0px 4px 12px #666;
			    font-size: 20px;
			}
			
			#register {
			    position: relative;
			    display: block;
			    top: 35px;
			    text-align: center;
			    color: #666;
			}
			.headerDiv{
				margin: 16% 0 7% 0;
			}
			.headerDiv>img{
			    border-radius: 50%;
			    width: 130px;
			    height: 130px;
		       box-shadow: 0px 5px 13px #666;
		       animation: dong 3s linear;
			}
			.register{
				color: #9c0202;
				font-size: 20px;
			}
			@keyframes dong{
				0%{ 
					transform: rotateY(0deg);
				}
				 25%{
					transform: rotateY(180deg);
				 }
				 50%{
					transform: rotateY(360deg);
				 }
				 75%{
				 	transform: rotateY(180deg);
				 }
				 100%{
					transform: rotateY(0deg);
				  }
			 }
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">登录</h1>
		</header>
		<div class="mui-content ">
			<div class="bg-img">
				<div class="mui-row mui-text-center headerDiv">
					<img src="../../img/timg.jpg" />
				</div>
				<div class="mui-input-group">
					<div class="mui-input-row">
						<label>手机号:</label>
						<input type="text" class="mui-input-clear" placeholder="phone">
					</div>
					<div class="mui-input-row">
						<label>密&nbsp;&nbsp;码:</label>
						<input type="text" class="mui-input-clear" placeholder="password">
					</div>
				</div>
				<button type="button" class="mui-btn mui-btn-blue mui-btn-block" id="login">登&nbsp;&nbsp;录</button>
				<div id="register">还没有账号？快来<a class="register" href="reg.html">注册</a>,开始管理你的计划吧！</div>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init();
		</script>
	</body>

</html>